// 导入 vue
import Vue from "vue";
// 导入 vuex
import Vuex from "vuex";
// vuex也是vue的插件, 需要use一下, 进行插件的安装初始化
Vue.use(Vuex);

// 创建仓库 store

const store = new Vuex.Store({
  // 状态,就是数据,存放公共数据
  state: {
    num: 100,
  },
  // 突变, 里面存放都是函数,负责修改state的数据
  mutations: {
    // 声明一个函数 用来修改 state.num
    // payload 载荷 表示 传递过来的参数 1
    setNum(state, payload) {
      // state.num = 200;
      state.num = state.num + payload;
    },
  },
  // 读取器,理解为 vuex中的计算属性
  getters: {
    numText(state) {
      return state.num + "个";
    },
  },
  // 行为 ,可以实现 异步 修改state或者组合多个actions
  actions: {
    // 异步修改 num
    asyncSetNum(store) {
      // 模拟异步操作  替换发送ajax 服务端 索要数据
      setTimeout(() => {
        store.commit("setNum", 3);
      }, 3000);
    },
  },
  // 模块,大型项目中存放的数据可以分模块管理
  module: {},
});

// 导出仓库
export default store;
